<template>
    <div class="top_div">
        <el-form :model="form">
            <el-form-item label="商品属性">
                <el-input v-model="form.name" />
            </el-form-item>
            <el-form-item label="商品类型">
                <el-select v-model="form.region" placeholder="">
                </el-select>
            </el-form-item>
        </el-form>
        <div>
            <el-radio-group class="ml-4" v-model="radio2">
                <el-radio label="1">普通</el-radio>
                <el-radio label="2">颜色</el-radio>
            </el-radio-group>
        </div>
        <div>
            <el-radio-group class="ml-4" v-model="radio2">
                <el-radio label="1">不需要检索</el-radio>
                <el-radio label="2">关键字检索</el-radio>
                <el-radio label="2">范围检索</el-radio>
            </el-radio-group>
        </div>
        <div>
            <el-radio-group class="ml-4" v-model="radio2">
                <el-radio label="1">是</el-radio>
                <el-radio label="2">否</el-radio>
            </el-radio-group>
        </div>
        <div>
            <el-radio-group class="ml-4" v-model="radio2">
                <el-radio label="1">唯一</el-radio>
                <el-radio label="2">单选</el-radio>
                <el-radio label="2">复选</el-radio>
            </el-radio-group>
        </div>
        <div>
            <el-radio-group class="ml-4" v-model="radio2">
                <el-radio label="1">手工录入</el-radio>
                <el-radio label="2">从下面列表中选择</el-radio>
            </el-radio-group>
        </div>
        <el-form :model="form">
            <el-form-item label="属性可选值列表">
                <el-input v-model="form.name" />
            </el-form-item>
        </el-form>
        <div>
            <el-radio-group class="ml-4" v-model="radio2">
                <el-radio label="1">是</el-radio>
                <el-radio label="2">否</el-radio>
            </el-radio-group>
        </div>
        <el-form :model="form">
            <el-form-item label="排序属性">
                <el-input v-model="form.name" />
            </el-form-item>
        </el-form>
        <el-row class="mb-4">
            <template #default="scope">
                <el-button type="primary" @click="Addgoods(scope.row)">提交</el-button>
                <el-button>重置</el-button>
            </template>
        </el-row>
    </div>
</template>
  
<script lang="ts" setup>
import { reactive, ref } from 'vue'
import * as api from '../../request/api'
import type { Ref } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { IAddReturnGoods, IAdminListItem } from "../../request/QmsAdminConreillerA/index"
let add = false;   // false编辑 true 新增
let modalForm = ref({}) as Ref<IAdminListItem>
const form = reactive({
    name: '',
    region: ""
})
const radio2 = ref('1')
const Addgoods = (row: IAdminListItem) => {
    ElMessageBox.confirm(
        '是否确认提交!', "提示",
        {
            confirmButtonText: 'OK',
            cancelButtonText: 'Cancel',
            type: 'warning',
        }
    )
        .then(async () => {
            // 发请求
            // 去判断 是 编辑 还是添加
            if (add) {
                await api.admin.AdminAddItem(row)  // 新增
            }

            ElMessage({
                type: 'success',
                message: '操作成功',
            })
        })
        .catch(() => {
            ElMessage({
                type: 'info',
                message: '取消提交',
            })
        })
}
</script>

<style scoped>
.top_div {
    width: 800px;
    margin: 100px auto;
}
</style>
  